<!DOCTYPE html>
<html lang="en">

	<head>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<title>Costic Dashboard</title>
		<!-- Iconic Fonts -->
		<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
		<link rel="stylesheet" href="../../vendors/iconic-fonts/flat-icons/flaticon.css">
		<link href="../../vendors/iconic-fonts/font-awesome/css/all.min.css" rel="stylesheet">
		<!-- Bootstrap core CSS -->
		<link href="../../assets/css/bootstrap.min.css" rel="stylesheet">
		<!-- jQuery UI -->
		<link href="../../assets/css/jquery-ui.min.css" rel="stylesheet">
		<!-- Page Specific Css (Datatables.css) -->
		<link href="../../assets/css/datatables.min.css" rel="stylesheet">
		<!-- Costic styles -->
		<link href="../../assets/css/style.css" rel="stylesheet">
		<!-- Favicon -->
		<link rel="icon" type="image/png" sizes="32x32" href="../../favicon.ico">

	</head>

	<body class="ms-body ms-aside-left-open ms-primary-theme ms-has-quickbar">

		<div class="ms-panel">
			<div class="ms-panel-header">
				<h6>Hoverable Rows Datatable</h6>
			</div>
			<div class="ms-panel-body">

				<div class="table-responsive">
					<div id="data-table-6_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">

						<div class="row">
							<div class="col-sm-12">
								<table id="data-table-6" class="table table-hover w-100 dataTable no-footer" role="grid"
									aria-describedby="data-table-6_info" style="width: 1098px;">
									<thead>
										<tr role="row">
											<th class="sorting_asc" tabindex="0" aria-controls="data-table-6"
												rowspan="1" colspan="1" aria-sort="ascending"
												aria-label="Product ID: activate to sort column descending"
												style="width: 166px;">ID</th>
											<th class="sorting" tabindex="0" aria-controls="data-table-6" rowspan="1"
												colspan="1" aria-label="Product Name: activate to sort column ascending"
												style="width: 325px;">Product Name</th>
											<th class="sorting" tabindex="0" aria-controls="data-table-6" rowspan="1"
												colspan="1" aria-label="Quantity: activate to sort column ascending"
												style="width: 141px;">Quantity</th>
											<th class="sorting" tabindex="0" aria-controls="data-table-6" rowspan="1"
												colspan="1" aria-label="Status: activate to sort column ascending"
												style="width: 156px;">Status</th>
											<th class="sorting" tabindex="0" aria-controls="data-table-6" rowspan="1"
												colspan="1" aria-label="Price: activate to sort column ascending"
												style="width: 100px;">Price</th>

										</tr>
									</thead>
									<tbody>

										<tr role="row" class="odd">
											<td class="">55841</td>
											<td class=""><img src="../../assets/img/costic/french-fries.jpg"
													style="width:50px; height:30px;">Mexican Pizza</td>
											<td class="">3814</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$9</td>
										</tr>
										<tr role="row" class="even">
											<td class="">56212</td>
											<td class=""><img src="../../assets/img/costic/pizza.jpg"
													style="width:50px; height:30px;">Spicy Noodels</td>
											<td class="">2769</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$9</td>
										</tr>
										<tr role="row" class="odd">
											<td class="">45454</td>
											<td class=""><img src="../../assets/img/costic/french-fries.jpg"
													style="width:50px; height:30px;">Spicy Sandwich</td>
											<td class="">9608</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$13</td>
										</tr>
										<tr role="row" class="even">
											<td class="">22366</td>
											<td class=""><img src="../../assets/img/costic/egg-sandwich.jpg"
													style="width:50px; height:30px;">Multigrain Hot Cereal</td>
											<td class="">2558</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$13</td>
										</tr>
										<tr role="row" class="odd">
											<td class="">56454</td>
											<td class=""><img src="../../assets/img/costic/cereals.jpg"
													style="width:50px; height:30px;">cake</td>
											<td class="">5407</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$16</td>
										</tr>
										<tr role="row" class="even">
											<td class="">14451</td>
											<td class=""><img src="../../assets/img/costic/french-fries.jpg"
													style="width:50px; height:30px;">pizza</td>
											<td class="">5384</td>
											<td class="sorting_1">Out Of Stock</td>
											<td class="">$85</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>


		<script src="../../assets/js/jquery-3.3.1.min.js"></script>
		<script src="../../assets/js/popper.min.js"></script>
		<script src="../../assets/js/bootstrap.min.js"></script>
		<script src="../../assets/js/perfect-scrollbar.js"> </script>
		<script src="../../assets/js/jquery-ui.min.js"> </script>
		<!-- Global Required Scripts End -->

		<!-- Page Specific Scripts Start -->
		<script src="../../assets/js/datatables.min.js"> </script>
		<script src="../../assets/js/data-tables.js"> </script>
		<!-- Page Specific Scripts End -->

		<!-- Costic core JavaScript -->
		<script src="../../assets/js/framework.js"></script>

		<!-- Settings -->
		<script src="../../assets/js/settings.js"></script>

	</body>

</html>
